import React from 'react';
import {inject, observer} from 'mobx-react';
import {WeaTop, WeaTab, WeaAuth, WeaRightMenu, WeaLocaleProvider,WeaTools} from 'ecCom';
import {WeaTableNew} from 'comsMobx';
import {Button,Modal,message} from 'antd';
import {routerShape} from 'react-router';
import allStore from '../../stores';
import {Condition, getAdButtons} from '../list/ListCondition';
import ShareModal from './ShareModal';
import SaveAsModal from '../../public/wf-save-as-template';
// import LogModal from './LogModal';
import AddSubComs from './AddSubComs';
import Style from '../../style/customReportForm.less';

const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;
const Base64 = WeaTools.Base64;

@inject('wfCusReportFormStore')

@observer

export default class Main extends React.Component {

    static contextTypes = {
        router: routerShape
    }

    constructor(props) {
        super(props);
        let _this = this;
        window.openReport = function (reportid) {
            _this.context.router.push({
                pathname : "/main/workflow/viewCustomReport",
                query : {
                    reportid,
                }
            });
        }
    }

    doInit() {
        const{location} = this.props;
        const {wfCusReportFormStore} = this.props;
        if(location.query.tabTitle){
            wfCusReportFormStore.title = Base64.decode(decodeURIComponent(location.query.tabTitle));
        }
        window.wfCustomReportOperate = operate(this);
        wfCusReportFormStore.initDatas(location.query);
        wfCusReportFormStore.doSearch();
    }

    componentDidMount() {
        this.doInit();
    }

    componentWillUnmount () {
        const {wfCusReportFormStore} = this.props;
        wfCusReportFormStore.clearStatus();
    }

    componentWillReceiveProps(nextProps) {
        if(this.props.location.key !== nextProps.location.key){
            const {wfCusReportFormStore} = this.props;
            wfCusReportFormStore.clearStatus();
            this.doInit();
        }
    }

    newReportForm() {
        allStore.wfCusReportAddStore.setCusReportAddModalShow(true);
    }

    batchDelete(reportids) {
        const {wfCusReportFormStore} = this.props;
        Modal.confirm({
            title: getLabel(131329,'信息确认'),
            content: getLabel(129890,'确定要删除吗？'),
            okText: getLabel(83446,'确定'),
            cancelText: getLabel(31129,'取消'),
            onOk: ()=>{
                wfCusReportFormStore.batchDelete(reportids);
            }
        });
    }

    saveAsOtherSave(value) {
        const {wfCusReportFormStore} = this.props;
        const {reportid} = wfCusReportFormStore;
        wfCusReportFormStore.saveAsOtherSave({reportid,reportName : value});

    }

    logModal() {
        const {wfCusReportFormStore} = this.props;
        wfCusReportFormStore.toogleLogModal();
    }

    getButtons() {
        const {wfCusReportFormStore} = this.props;
        const {tab} = wfCusReportFormStore;
        let btns = [];
        const ids = this.getSelectedRowKeysTail();
        if (Number(tab) === 0) {
            btns.push(
                (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@3yfqt7@newReportForm`} type="primary" onClick={() => this.newReportForm()}>{getLabel(83981,'新建')}</Button>),
                (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ia6h72@batchDelete`} type="primary" disabled={!ids} onClick={() => this.batchDelete(ids)}>{getLabel(32136,'批量删除')}</Button>)
            );
        }
        return btns;
    }

    getSelectedRowKeysTail() {
        const {wfCusReportFormStore} = this.props;
        const {tableStore} = wfCusReportFormStore;
        const tableNow = tableStore;
        const selectedRowKeys = tableNow.selectedRowKeys;
        const idsJson = JSON.stringify(selectedRowKeys);
        let ids = idsJson.slice(1, idsJson.length - 1).replace(/\"/g, "");
        return ids;
    }

    dropMenuDatas() {
        const {wfCusReportFormStore} = this.props;
        const {tab} = wfCusReportFormStore;
        let btns = [];
        const ids = this.getSelectedRowKeysTail();
        if (Number(tab) == 0) {
            btns.push(
                {
                    key: "1",
                    icon: <i className="icon-coms-New-Flow"/>,
                    content: getLabel(83981,'新建'),
                    onClick: key => {
                        this.newReportForm();
                    }
                }, {
                    key: "2",
                    icon: <i className="icon-coms-Batch-delete"/>,
                    disabled : !ids,
                    content: getLabel(32136,'批量删除'),
                    onClick: key => {
                        this.batchDelete(ids);
                    }
                }
            );
        }

        return btns;
    }

    switchTab(tab) {
        const {wfCusReportFormStore} = this.props;
        wfCusReportFormStore.switchTabs(tab);
    }

    //获取tabs
    getTabs () {
        const tabDatas = [
            {
                key: 'myReport',
                title: getLabel(383622,'我的报表'),
                tab: 0
            }, {
                key: 'shareReport',
                title: getLabel(383623,'共享报表'),
                tab: 1
            }
        ];
        return tabDatas;
    }

    handleOk = value => this.saveAsOtherSave(value);
    render() {
        const {wfCusReportFormStore} = this.props ;
        const {title, loading, tab, form, tableStore, showSearchAd} = wfCusReportFormStore;
        const formParams = form.getFormParams() || {};
        const tabDatas = this.getTabs();
        return (
            <div className="wf-customReport-List" style={{height: '100%'}}>
                <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@jaggoa`} datas={this.dropMenuDatas()}>
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@d1fnyd`}
                        title={title}
                        loading={loading}
                        icon={<i className="icon-coms-workflow"/>}
                        iconBgcolor="#0079DE"
                        buttons={this.getButtons()}
                        buttonSpace={10}
                        showDropIcon={true}
                        dropMenuDatas={this.dropMenuDatas()}
                    >
                        <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@l3fu8v`}
                            datas={tabDatas}
                            keyParam="tab"  //主键
                            buttonsAd={getAdButtons(wfCusReportFormStore, this.props && this.props.ecId || '')}
                            searchType={['base', 'advanced']}
                            searchsBaseValue={formParams.reportName}
                            onChange={(tab) => this.switchTab(tab)}
                            showSearchAd={showSearchAd}
                            selectedKey={tab}
                            searchsAd={
                                <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@42prfq`} listStore={wfCusReportFormStore}/>
                            }
                            onSearchChange={v => {
                                wfCusReportFormStore.setFormFields({reportName: {value: v}})
                            }}
                            onSearch={v => {
                                wfCusReportFormStore.doSearch()
                            }}
                            setShowSearchAd={bool => {
                                wfCusReportFormStore.setShowSearchAd(bool)
                            }}
                            hideSearchAd={() => wfCusReportFormStore.setShowSearchAd(false)}
                            advanceHeight={150}
                        />

                        <ShareModal ecId={`${this && this.props && this.props.ecId || ''}_ShareModal@k61rha`}/>
                        <AddSubComs ecId={`${this && this.props && this.props.ecId || ''}_AddSubComs@ydobug`}/>

                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@s4apsp`}
                            className='listTable'
                            comsWeaTableStore={tableStore}
                            hasOrder={true}
                            needScroll={true}
                        />
                    </WeaTop>
                </WeaRightMenu>
                <SaveAsModal ecId={`${this && this.props && this.props.ecId || ''}_SaveAsModal@sjf9en`}
                    ref={saveAsModal => this.saveAsModal = saveAsModal}
                    type="modal"
                    length={100}
                    modolName={getLabel(131623,'另存为')}
                    handleOk={this.handleOk}
                />
            </div>
        )
    }
}

const operate = function (_this) {
    const {wfCusReportFormStore} = _this.props;
    return {
        viewReport (reportid) {
            window.openFullWindowHaveBar(`/spa/workflow/static/index.html#/main/workflow/viewCustomReport?reportid=${reportid}`);
        },
        editReport (reportid) {
            wfCusReportFormStore.setReportid(reportid);
            allStore.wfCusReportAddStore.setCusReportAddModalShow(true,reportid);
        },
        shareReport (reportid,reportname) {
            wfCusReportFormStore.setReportid(reportid);
            allStore.wfReportShareStore.toogleShareModal(true,{reportid,reportname});
        },
        saveAsOther (reportid) {
            wfCusReportFormStore.setReportid(reportid);
            _this.saveAsModal.click(true);
        },
        deleteReport (reportid) {
            wfCusReportFormStore.setReportid(reportid);
            Modal.confirm({
                title: getLabel(131329,'信息确认'),
                content: getLabel(129890,'确定要删除吗？'),
                okText:  getLabel(83446,'确定'),
                cancelText: getLabel(31129,'取消'),
                onOk: ()=>{
                    wfCusReportFormStore.batchDelete(reportid);
                }
            });
        },
        logReport (reportid) {
            wfCusReportFormStore.setReportid(reportid);
            // console.log('日志');
            // allStore.wfCustomLogStore.toogleLogModal(true);
        }
    }
}
